<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>网上商店</title>
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='css/index.css') }}">
</head>
<body>
    <!-- 导航栏 -->
    <nav>
        <ul>
            <li><a href="/">首页</a></li>
            <li><a href="/products">产品</a></li>
            <li><a href="/cart">购物车</a></li>
            <li><a href="/orders">我的订单</a></li>
            <li><a href="/about">关于我们</a></li>
            <li><a href="/contact">联系我们</a></li>
            {% if 'username' in session %}
            <li><a href="/profile">个人资料</a></li>
            <li>
                {% if avatar %}
                <img src="data:image/jpeg;base64,{{ avatar | b64encode }}" alt="头像" class="nav-avatar">
                {% endif %}
                <a href="/logout">登出</a>
            </li>
            {% else %}
            <li><a href="/login">登录</a></li>
            <li><a href="/register">注册</a></li>
            {% endif %}
        </ul>
    </nav>

    <!-- 主内容 -->
    <div class="main-content">
        {% if 'username' in session %}
        <h2>欢迎 {{ username }}</h2>
        <p>看看我们最新的产品：</p>
        <div class="product-grid">
            {% for product in products %}
            <div class="product">
                <img src="data:image/jpeg;base64,{{ product['image'] }}" alt="产品图片">
                <h3>{{ product['name'] }}</h3>
                <p>￥{{ product['price'] }}</p>
                <form action="{{ url_for('add_to_cart') }}" method="post">
                    <input type="hidden" name="product_id" value="{{ product['id'] }}">
                    <button type="submit">添加到购物车</button>
                </form>
            </div>
            {% endfor %}
        </div>
        <h3>推荐产品</h3>
        <div class="product-grid">
            {% for product in recommended %}
            <div class="product">
                <img src="data:image/jpeg;base64,{{ product['image'] }}" alt="产品图片">
                <h3>{{ product['name'] }}</h3>
                <p>￥{{ product['price'] }}</p>
                <form action="{{ url_for('add_to_cart') }}" method="post">
                    <input type="hidden" name="product_id" value="{{ product['id'] }}">
                    <button type="submit">添加到购物车</button>
                </form>
            </div>
            {% endfor %}
        </div>
        {% else %}
        <h2>欢迎来到我们的网上商店</h2>
        <p>请 <a href="/login">登录</a> 或 <a href="/register">注册</a> 开始购物。</p>
        {% endif %}
    </div>

    <!-- 页脚 -->
    <footer>
        <p>&copy; 2024 网上商店。保留所有权利。</p>
        <ul>
            <li><a href="/terms">服务条款</a></li>
            <li><a href="/privacy">隐私政策</a></li>
        </ul>
    </footer>
</body>
</html>
